import TinyReact from './TinyReact';
import Component from "./TinyReact/Component";

const root = document.getElementById('root');

const vdom = (
  <div>
    <h1 id="text">{1 + 1} 234234234</h1>
  </div>
)

console.log(vdom);


class Alert extends TinyReact.Component {
  constructor(props) {
    super(props);
    this.state = {
      title: '默认标题',
    }
  }

  handleClick = () => {
    this.setState({
      title: '修改的标题',
    })
  }

  render() {
    console.log(this)
    return <div>
      234234
      <h1>{this.state.title}</h1>
      <h1>{this.props.name}</h1>
      <h5>{this.props.age}</h5>
      <button onClick={this.handleClick}>修改类别</button>
    </div>
  }
}

class Heart extends Component {

  render() {
    return (
      <div>
        我是 heart
      </div>
    );
  }

}

TinyReact.render(<Alert name="张三" age="18"/>, root);

setTimeout(() => {
  TinyReact.render(<Alert name="李四" age="20"/>, root);
}, 1000);
